<%@page import="model.bean.Coquan"%>
<%@page import="model.bean.Chucvu"%>
<%@page import="java.util.ArrayList"%>
<%@page import="model.bean.Calendar"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%
	String uName = (String) request.getSession().getAttribute("uName");
	String role = (String) request.getSession().getAttribute("role");	
	if((uName == null) || !("admin".equals(role) || !"user".endsWith(role))) {
		response.sendRedirect("login.jsp");
	}
%> 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="UTF-8">
<title>ĐỒ ÁN TỐT NGHIỆP</title>
<meta
	content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no'
	name='viewport'>
<!-- bootstrap 3.0.2 -->
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<!-- font Awesome -->
<link href="css/font-awesome.min.css" rel="stylesheet" type="text/css" />
<!-- Ionicons -->
<link href="css/ionicons.min.css" rel="stylesheet" type="text/css" />
<!-- Morris chart -->
<link href="css/morris/morris.css" rel="stylesheet" type="text/css" />
<!-- jvectormap -->
<link href="css/jvectormap/jquery-jvectormap-1.2.2.css" rel="stylesheet"
	type="text/css" />
<!-- Date Picker -->
<link href="css/datepicker/datepicker3.css" rel="stylesheet"
	type="text/css" />
<!-- Daterange picker -->
<link href="css/daterangepicker/daterangepicker-bs3.css"
	rel="stylesheet" type="text/css" />
<!-- bootstrap wysihtml5 - text editor -->
<link href="css/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css"
	rel="stylesheet" type="text/css" />
<!-- Theme style -->
<link href="css/AdminLTE.css" rel="stylesheet" type="text/css" />
<link href="mycss/popup.css" rel="stylesheet" type="text/css" />
</head>
<body class="skin-blue">

	<%
		ArrayList<Chucvu> dsChucvu = (ArrayList<Chucvu>)request.getAttribute("dsChucvu");
	    ArrayList<Coquan> dsCoquan = (ArrayList<Coquan>)request.getAttribute("dsCoquan");
	    String them = (String)request.getAttribute("success");
	%>
	<!-- header logo: style can be found in header.less -->
	<%@ include file="header.jsp"%>

	<div class="wrapper row-offcanvas row-offcanvas-left">
		<!-- Left side column. contains the logo and sidebar -->
		<%@ include file="menu.jsp"%>

		<!-- Right side column. Contains the navbar and content of the page -->
		<aside class="right-side"> <!-- Content Header (Page header) -->
		<section class="content-header">
		<h1>Quản lý cán bộ</h1>
		<ol class="breadcrumb">
			<li><a href="#"><i class="fa fa-dashboard"></i> Trang chủ</a></li>
			<li><a href="#">Quản lý cán bộ</a></li>
			<li class="active">Thêm mới</li>
		</ol>
		</section> <!-- Main content --> <section class="content">
		<div class="col-md-6">

			<%
				if ("true".equals(them)) {
			%>
			<div class="alert alert-success alert-dismissable">
			<i class="fa fa-info"></i>
				<button type="button" class="close" data-dismiss="alert"
					aria-hidden="true">×</button>
				<b>Thông báo: </b> Thêm mới cán bộ thành công.
			</div>
			<%
				}
			%>
				
			<% 	
				if ("false".equals(them)) {					
			%>
			<div class="alert alert-danger alert-dismissable">
			    <i class="fa fa-info"></i>
				<button type="button" class="close" data-dismiss="alert"
					aria-hidden="true">×</button>
				<b>Lỗi kết nối: </b> Thêm mới không thành công!
			</div>
			<%
				}
			%>
		</div>	
		<div class="row">
			<!-- left column -->
			<div class="col-md-12">	
				<!-- general form elements -->
				<div class="box box-primary">
					<!-- /.box-header -->
					<!-- form start -->
					<form action="CanBoServlet" method="post" id="myform">
						<div class="box-body">
							<div class="form-group">
									<div class="col-md-4">														
									<label>Chức vụ:</label> 
									<div class="input-group">
										<div class="input-group-addon">
											<i class="fa fa-arrow-circle-down"></i>
										</div>
									<select class="form-control"
										name="idcv" id="idcv">
										<option value="true">[--Chọn--]</option>
										<%
											if(dsChucvu != null) {
												for(Chucvu cv : dsChucvu) { %>
													<option value="<%=cv.getId()%>"><%=cv.getTencv() %></option>													
										<%
												}
											}
										%>										
									</select>
									</div>							
									<label>Phòng ban:</label> 
									<div class="input-group">
										<div class="input-group-addon">
											<i class="fa fa-arrow-circle-down"></i>
										</div>
									<select class="form-control"
										name="idcq" id="idcq">
										<option value="true">[--Chọn--]</option>
										<%
											if(dsCoquan != null) {
												for(Coquan cq : dsCoquan) { %>
													<option value="<%=cq.getIdcq()%>"><%=cq.getTencq() %></option>													
										<%
												}
											}
										%>	
									</select>
									</div>
									<label>Ngày sinh:</label> 
									<div class="input-group">
										<div class="input-group-addon">
											<i class="fa fa-clock-o"></i>
										</div>
									<input class="form-control"
									type="text" placeholder="Click chọn ngày tháng" id="datepicker"
									name="date" required="true"></div></br>
									<label>Giới tính:</label> <input type="radio" name="sex"
									value="1" required="true">Nam <input type="radio"
									name="sex" value="0">Nữ
									</div>
							<div class="col-md-8">											
							  <label>Tên cán bộ:</label> 
							  <div class="input-group">
										<div class="input-group-addon">
											<i class="fa fa-user"></i>
										</div>
							  <input class="form-control"
									type="text" placeholder="Nhập vào tên cán bộ" name="tencb" required="true">
									</div>
							   <label>Điện thoại:</label> 
							   <div class="input-group">
										<div class="input-group-addon">
											<i class="fa fa-phone"></i>
										</div>
									<input class="form-control" type="number"
									placeholder="Nhập vào SĐT" name="dienthoai" required="true">
							  </div>
							   <label>Email:</label> 
							    <div class="input-group">
										<div class="input-group-addon">
											<i class="fa fa-rss-square"></i>
										</div>
							   <input class="form-control" type="email" placeholder="Nhập vào email"
									name="email" required="true"> 
									</div>	
									<label>Địa chỉ:</label> 
									<div class="input-group">
										<div class="input-group-addon">
											<i class="fa  fa-info-circle"></i>
										</div>
									<input class="form-control" type="text" placeholder="Nhập vào địa chỉ"
									name="diachicq" required="true">
								</div>
								<!-- /.form group -->
							  </div>	
						 	<input type="hidden" name="them"/>
							</form>
							<div class="box-footer">
								<button type="submit" class="btn btn-success" onclick="kt()">Thêm
									mới</button>
								<a href="CanBoServlet?boqua" class="btn btn-primary">Bỏ qua</a>
							</div>
						</div>
					<!-- popup -->
					<div id="element_to_pop_up">
						<a class="button b-close">X</a>
						<h3>Bạn chưa chọn cơ quan</h3>
						<a href="#" onclick="closepopup()"><span class="button small pop1">OK</span></a>
				    </div>
				    <div id="element_to_pop_up2">
						<a class="button b-close">X</a>
						<h3>Bạn chưa chọn chức vụ</h3>
						<a href="#" onclick="closepopup2()"><span class="button small pop1">OK</span></a>
				    </div>
				</div>
				<!-- /.box -->

				<!-- Form Element sizes -->

			</div>
			<!--/.col (left) -->
		</div>
		<!-- /.row --> </section><!-- /.content --> </aside>
		<!-- /.right-side -->
	</div>
	<!-- ./wrapper -->
	<!-- jQuery 2.0.2 -->
	<script src="js/jquery.min.js"></script>
	<!-- Bootstrap -->
	<script src="js/bootstrap.min.js" type="text/javascript"></script>
	<!-- InputMask -->
	<script src="js/plugins/input-mask/jquery.inputmask.js"
		type="text/javascript"></script>
	<script src="js/plugins/input-mask/jquery.inputmask.date.extensions.js"
		type="text/javascript"></script>
	<script src="js/plugins/input-mask/jquery.inputmask.extensions.js"
		type="text/javascript"></script>
	<!-- date-range-picker -->
	<script src="js/plugins/daterangepicker/daterangepicker.js"
		type="text/javascript"></script>
	<!-- bootstrap color picker -->
	<script src="js/plugins/colorpicker/bootstrap-colorpicker.min.js"
		type="text/javascript"></script>
	<!-- bootstrap time picker -->
	<script src="js/plugins/timepicker/bootstrap-timepicker.min.js"
		type="text/javascript"></script>
	<!-- bootstrap datepicker -->
	<script src="js/plugins/datepicker/bootstrap-datepicker.js"
		type="text/javascript"></script>
	<!-- AdminLTE App -->
	<script src="js/AdminLTE/app.js" type="text/javascript"></script>
	<!-- AdminLTE for demo purposes -->
	<script src="js/AdminLTE/demo.js" type="text/javascript"></script>
	<!-- popup -->
	<script src="myjs/bpopup.min.js" type="text/javascript"></script>
	<!-- Page script -->
	<script>
		$(function() {
			$("#datepicker").datepicker({
				format : 'yyyy-mm-dd'
			});
		});
		
		function kt() {
			var idcv = document.getElementById('idcv').value;
			var idcq = document.getElementById('idcq').value;
			if(idcv == "true") {
				$('#element_to_pop_up').bPopup({
					speed : 650,
					transition : 'slideIn',
					transitionClose : 'slideBack'
				});
			} 
			else if(idcq == "true") {
				$('#element_to_pop_up2').bPopup({
					speed : 650,
					transition : 'slideIn',
					transitionClose : 'slideBack'
				});
			}
			else {
				document.forms['myform'].submit;
			}
		}
		
		function closepopup() {
			$('#element_to_pop_up').bPopup().close();
		}
		function closepopup2() {
			$('#element_to_pop_up2').bPopup().close();
			
		}
	</script>
</body>
</html>